<template>
    <a-modal :visible="visible" :width="1200" @ok="submit" @cancel="cancel">
        <div>
            <a-table ref="table" size="middle" :scroll="{ x: true }" :bordered="false" rowKey="id" :columns="columns"
                :dataSource="dataSource" :rowSelection="{
                    selectedRowKeys: selectedRowKeys,
                    onChange: onSelectChange,
                    getCheckboxProps: (record) => ({
                        props: {
                            defaultChecked: record.checked
                        }
                    })
                }" class="j-table-force-nowrap" @change="handleTableChange">
            </a-table>
        </div>
    </a-modal>
</template>
  
<script>
import { postAction, getAction, getFileAccessHttpUrl } from '@api/manage'
export default {
    name: 'HcRiderList',
    data() {
        return {
            description: '企业',
            // 表头
            columns: [
                {
                    title: '列名',
                    align: "center",
                    dataIndex: 'name',
                    scopedSlots: { customRender: 'companyNameSlot' },
                },
            ],
            dataSource: [
                {
                    key: 'username',
                    name: '姓名'
                },
                {
                    key: 'pickupAddress',
                    name: '取餐地址'
                },
                {
                    key: 'merchantName',
                    name: '商户名称'
                },
                {
                    key: 'foodsName',
                    name: '菜品'
                },
                {
                    key: 'cost',
                    name: '金额'
                },
                {
                    key: 'remark',
                    name: '备注'
                },
                {
                    key: 'department',
                    name: '部门'
                },
                {
                    key: 'submissionTime',
                    name: '提交时间'
                }
            ],
            selectedRowKeys: [],
            selectionRows: [],
            visible: false,
            menuId: ''
        }
    },
    mounted() {
    },
    methods: {
        show(id) {
            this.menuId = id;
            this.visible = true;
        },
        async submit() {
            console.log('this.selectionRows', this.selectionRows);
            if (this.selectionRows.length == 0) {
                this.$message.warning('请先选择至少一项'); return;
            } else {
                let list = [];
                this.selectionRows.forEach(item => {
                    list.push({
                        [item.key]: item.name
                    })
                })
                console.log('list', list);
                let res = await postAction('/hc/hcCompanyFoodOrder/customExportXls', { fieldList: list, detailId: this.menuId })
                window.open(this.getImgView(res.result))
                console.log('res', res);
            }
        },
        /* 图片预览 */
        getImgView(text) {
            if (text && text.indexOf(",") > 0) {
                text = text.substring(0, text.indexOf(","))
            }
            return getFileAccessHttpUrl(text)
        },
        cancel() {
            this.visible=false;
        },
        onSelectChange(selectedRowKeys, selectionRows) {
            this.selectedRowKeys = selectedRowKeys;
            this.selectionRows = selectionRows;
        },
        handleTableChange() {

        }
    }
}
</script>
<style scoped>
@import '~@assets/less/common.less';
</style>